<template>
  <div>
    <!-- 顶部信息 -->
    <Activity
      :clueValue="clueValue"
      @getClueValue="getClueValue"
      @closeDrawer="closeDrawer"
      @prev="prev"
      @next="next"
      @refreshPage="emit('refreshData')"
      :tagMap="tagMap"
      :isLoad="isLoading"
      :isPool="isPool"
      :validateWrite="validateWrite"
      :validateOwnerUser="validateOwnerUser"
      :moduleOption="moduleOption"
    />
    <!-- 更进记录 -->
    <FlowUp v-if="selectTag == 0" :clueValue="clueValue" :bizType="BizTypeEnum.CRM_CLUE" />
    <!-- 详细资料 -->
    <Details v-if="selectTag == 1" :clueValue="clueValue" />
    <System v-if="selectTag == 1" :clueValue="clueValue" />
    <!-- 团队成员 -->
    <teamMembers
      v-if="selectTag == 2"
      :bizId="clueValue.id"
      :bizType="BizTypeEnum.CRM_CLUE"
      :showAction="true"
    />
    <!-- 操作日志 -->
    <Log
      v-if="selectTag == 3"
      :clueValue="clueValue"
      :id="clueValue.id"
      :bizType="BizTypeEnum.CRM_CLUE"
    />
    <!-- ai摘要 -->
    <AiSummary v-if="selectTag == 4" :clueValue="clueValue" />
    <!-- 广告信息 -->
    <AdverInfo v-if="selectTag == 5" :clueValue="clueValue" />
  </div>
</template>

<script setup>
import Activity from './activity.vue'
import * as ClueApi from '@/api/crm/clue'
import * as customerTagApi from '@/api/crm/customerTagConfig/index'
import { customFieldHeadList } from '@/api/crm/module/index'
import { BizTypeEnum } from '@/api/crm/permission'
import * as PermissionApi from '@/api/crm/permission'
import FlowUp from './flowUp.vue'
import Details from './details.vue'
import System from './system.vue'
import teamMembers from '@/views/crm/components/teamMembers/index.vue'
import Log from '@/views/crm/components/log/index.vue'
import { useUserStoreWithOut } from '@/store/modules/user'
import AiSummary from './aiSummary.vue'
import AdverInfo from './adverInfo.vue'

const props = defineProps({
  selectTag: Number,
  id: String,
  nowIds: Array,
  moduleOption: Array
})
const clueId = ref('')
const emit = defineEmits(['setDrawer', 'refreshData'])
const clueValue = ref({})
const tagMap = ref([])
const isLoading = ref(false)
/**线索的详情*/
const getClueValue = async () => {
  try {
    isLoading.value = true
    const res = await ClueApi.getClue(clueId.value)
    const filedResult = await customFieldHeadList({
      moduleId: clueId.value,
      tableType: '1'
    })
    if (filedResult) {
      res.detailFiled = filedResult.filter((item) => item.isShow == 1)
    }
    const results = await ClueApi.getClueTag({ ids: [clueId.value] })
    res.labelList = results[clueId.value] || []
    clueValue.value = res
  } finally {
    isLoading.value = false
  }
}
const teamMembersList = ref([])
const loading = ref(false)
/** 查询列表 */
const getTeamMembers = async () => {
  loading.value = true
  try {
    const data = await PermissionApi.getPermissionList({
      bizType: BizTypeEnum.CRM_CLUE,
      bizId: props.id
    })
    teamMembersList.value = data
  } finally {
    loading.value = false
  }
}
/**标签列表*/
const getTagList = async () => {
  const { list } = await customerTagApi.getCustomerTagPage()
  tagMap.value = list
}
/**上一条*/
const prev = () => {
  const index = props.nowIds.indexOf(clueId.value) - 1
  if (props.nowIds[index]) {
    clueId.value = props.nowIds[index]
    getClueValue()
    getTeamMembers()
  } else {
    ElMessage.error('没有更多了')
  }
}
/**下一条*/
const next = () => {
  const index = props.nowIds.indexOf(clueId.value) + 1
  if (props.nowIds[index]) {
    clueId.value = props.nowIds[index]
    getClueValue()
    getTeamMembers()
  } else {
    ElMessage.error('没有更多了')
  }
}
watch(
  () => props.id,
  (val) => {
    if (val) {
      clueId.value = val
      getClueValue()
      getTeamMembers()
      getTagList()
    }
  },
  { deep: true, immediate: true }
)
/**关闭*/
const closeDrawer = () => {
  emit('setDrawer')
}

// 校验负责人权限和编辑权限
const validateOwnerUser = ref(false)
const validateWrite = ref(false)
const isPool = ref(false)
const userStore = useUserStoreWithOut()

watch(
  () => teamMembersList.value,
  (newArr) => {
    isPool.value = false
    validateOwnerUser.value = false
    validateWrite.value = false
    if (newArr.length > 0) {
      isPool.value = !newArr.some((item) => item.level === PermissionApi.PermissionLevelEnum.OWNER)
      const userId = userStore.getUser?.id
      newArr
        .filter((item) => item.userId === userId)
        .forEach((item) => {
          if (item.level === PermissionApi.PermissionLevelEnum.OWNER) {
            validateOwnerUser.value = true
            validateWrite.value = true
          } else if (item.level === PermissionApi.PermissionLevelEnum.WRITE) {
            validateWrite.value = true
          }
        })
    } else {
      isPool.value = true
    }
  },
  {
    immediate: true,
    deep: true
  }
)
</script>

<style lang="scss" scoped></style>
